/* ========================================
   工作流组件夜间模式统一样式
   Workflow Components Dark Theme Styles
   ======================================== */

/* ========================================
   1. ProcessDetailModal 弹窗夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .process-detail-modal {
  --el-dialog-width: 85%;
}

#htmlRoot[data-theme='dark'] .detail-container {
  max-height: 800px;
  overflow-y: auto;
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .tab-card {
  margin-bottom: 20px;
  background: #2a2a2a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .detail-tabs {
  min-height: 700px;
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .process-info-section {
  padding: 20px 0;
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .dialog-footer {
  text-align: right;
  background: #2a2a2a;
  border-top: 1px solid #333;
}

/* 弹窗夜间模式 */
#htmlRoot[data-theme='dark'] .el-dialog {
  background: #2a2a2a;
  border: 1px solid #333;
}

#htmlRoot[data-theme='dark'] .el-dialog__header {
  background: #2a2a2a;
  border-bottom: 1px solid #333;
}

#htmlRoot[data-theme='dark'] .el-dialog__title {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-dialog__body {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-dialog__footer {
  background: #2a2a2a;
  border-top: 1px solid #333;
}

/* Tab夜间模式 */
#htmlRoot[data-theme='dark'] .el-tabs__item {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-tabs__item.is-active {
  color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-tabs__active-bar {
  background-color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-tabs__content {
  background: #2a2a2a;
}

/* 描述列表夜间模式 */
#htmlRoot[data-theme='dark'] .el-descriptions__label {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-descriptions__content {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-descriptions__body {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .el-descriptions__table {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .el-descriptions__table th {
  background: #3a3a3a;
  border-color: #444;
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-descriptions__table td {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
}

/* 表单夜间模式 */
#htmlRoot[data-theme='dark'] .el-form-item__label {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-input__inner:focus {
  border-color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-textarea__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-textarea__inner:focus {
  border-color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-radio__label {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-radio__input.is-checked .el-radio__inner {
  border-color: #409eff;
  background: #409eff;
}

#htmlRoot[data-theme='dark'] .el-radio__input.is-checked + .el-radio__label {
  color: #409eff;
}

/* 按钮夜间模式 */
#htmlRoot[data-theme='dark'] .el-button {
  background-color: #2a2a2a;
  border-color: #555;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-button:hover {
  background-color: #3a3a3a;
  border-color: #666;
}

#htmlRoot[data-theme='dark'] .el-button--primary {
  background-color: #409eff;
  border-color: #409eff;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-button--primary:hover {
  background-color: #66b1ff;
  border-color: #66b1ff;
}

#htmlRoot[data-theme='dark'] .el-button--success {
  background-color: #67c23a;
  border-color: #67c23a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-button--success:hover {
  background-color: #85ce61;
  border-color: #85ce61;
}

/* 空状态夜间模式 */
#htmlRoot[data-theme='dark'] .el-empty__description {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .diagram-loading {
  min-height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #2a2a2a;
}

/* ========================================
   2. FormDetail 组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .form-detail {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .form-header h3 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .form-container {
  background: #2a2a2a;
  border: 1px solid #333;
}

#htmlRoot[data-theme='dark'] .form-placeholder {
  background: #2a2a2a;
  border: 1px solid #333;
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .no-form {
  background: #2a2a2a;
  color: #b0b0b0;
}

/* VForm3 夜间模式 */
#htmlRoot[data-theme='dark'] .v-form-render {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .v-form-render .el-form-item__label {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .v-form-render .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .v-form-render .el-textarea__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .v-form-render .el-select .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .v-form-render .el-date-editor .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

/* ========================================
   3. AssigneeConfig 组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .assignee-config {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .config-header h3 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .node-item {
  background: #1a1a1a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .node-name {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .assignee-item {
  background: #2a2a2a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .assignee-name {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .current-node {
  background: #2a2a2a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .current-node h4 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .expression-help {
  background: #2a2a2a;
  border-color: #444;
  color: #b0b0b0;
}

/* ========================================
   4. ProcessDiagram 组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .process-diagram {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .diagram-header h3 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .flow-diagram {
  background: #2a2a2a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .no-diagram {
  background: #2a2a2a;
  border-color: #333;
  color: #b0b0b0;
}

/* VueFlow 夜间模式 */
#htmlRoot[data-theme='dark'] .vue-flow__background {
  background-image:
    radial-gradient(circle, #444 1px, transparent 1px) !important;
}

#htmlRoot[data-theme='dark'] .vue-flow__background circle {
  fill: #444 !important;
  r: 1px !important;
}

#htmlRoot[data-theme='dark'] .vue-flow-canvas {
  background: #1f1f1f;
}

/* ========================================
   5. NodeStatus 组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .node-status {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .status-header h3 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-table {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-table th {
  background: #3a3a3a;
  border-color: #444;
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-table td {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-table--border {
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-table--border th,
#htmlRoot[data-theme='dark'] .el-table--border td {
  border-color: #444;
}

/* ========================================
   6. ApprovalHistory 组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .approval-history {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .history-header h3 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .node-name {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .approver-info,
#htmlRoot[data-theme='dark'] .approval-opinion,
#htmlRoot[data-theme='dark'] .approval-time {
  color: #b0b0b0;
}

/* 时间线夜间模式 */
#htmlRoot[data-theme='dark'] .el-timeline {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-timeline-item__node {
  background: #409eff;
}

#htmlRoot[data-theme='dark'] .el-timeline-item__timestamp {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-timeline-item__content {
  color: #ffffff;
}

/* ========================================
   7. 通用组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .el-card {
  background: #2a2a2a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .el-card__header {
  background: #3a3a3a;
  border-bottom-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-card__body {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-tag {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-tag--success {
  background: #67c23a;
  border-color: #67c23a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-tag--warning {
  background: #e6a23c;
  border-color: #e6a23c;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-tag--danger {
  background: #f56c6c;
  border-color: #f56c6c;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-tag--info {
  background: #909399;
  border-color: #909399;
  color: #ffffff;
}

/* 滚动条夜间模式 */
#htmlRoot[data-theme='dark'] ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

#htmlRoot[data-theme='dark'] ::-webkit-scrollbar-track {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] ::-webkit-scrollbar-thumb {
  background: #555;
  border-radius: 4px;
}

#htmlRoot[data-theme='dark'] ::-webkit-scrollbar-thumb:hover {
  background: #666;
}

/* 选择器夜间模式 */
#htmlRoot[data-theme='dark'] .el-select-dropdown {
  background: #2a2a2a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item:hover {
  background: #3a3a3a;
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item.selected {
  background: #409eff;
  color: #ffffff;
}

/* 日期选择器夜间模式 */
#htmlRoot[data-theme='dark'] .el-picker-panel {
  background: #2a2a2a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-picker-panel__content {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .el-date-table th {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-date-table td {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-date-table td.available:hover {
  background: #3a3a3a;
}

#htmlRoot[data-theme='dark'] .el-date-table td.current {
  background: #409eff;
  color: #ffffff;
}

/* 消息提示夜间模式 */
#htmlRoot[data-theme='dark'] .el-message {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

#htmlRoot[data-theme='dark'] .el-message--success {
  background: #67c23a;
  border-color: #67c23a;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(103, 194, 58, 0.3);
}

#htmlRoot[data-theme='dark'] .el-message--warning {
  background: #e6a23c;
  border-color: #e6a23c;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(230, 162, 60, 0.3);
}

#htmlRoot[data-theme='dark'] .el-message--error {
  background: #f56c6c;
  border-color: #f56c6c;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(245, 108, 108, 0.3);
}

#htmlRoot[data-theme='dark'] .el-message--info {
  background: #909399;
  border-color: #909399;
  color: #ffffff;
  box-shadow: 0 4px 12px rgba(144, 147, 153, 0.3);
}

/* 消息提示图标夜间模式 */
#htmlRoot[data-theme='dark'] .el-message__icon {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--success .el-message__icon {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--warning .el-message__icon {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--error .el-message__icon {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--info .el-message__icon {
  color: #ffffff;
}

/* 消息提示内容夜间模式 */
#htmlRoot[data-theme='dark'] .el-message__content {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--success .el-message__content {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--warning .el-message__content {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--error .el-message__content {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message--info .el-message__content {
  color: #ffffff;
}

/* 消息提示关闭按钮夜间模式 */
#htmlRoot[data-theme='dark'] .el-message__closeBtn {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-message__closeBtn:hover {
  color: #ffffff;
  opacity: 0.8;
}

/* 确保消息提示在夜间模式下有足够的对比度 */
#htmlRoot[data-theme='dark'] .el-message {
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* 消息提示动画夜间模式 */
#htmlRoot[data-theme='dark'] .el-message-fade-enter-active,
#htmlRoot[data-theme='dark'] .el-message-fade-leave-active {
  transition: all 0.3s ease;
}

#htmlRoot[data-theme='dark'] .el-message-fade-enter-from,
#htmlRoot[data-theme='dark'] .el-message-fade-leave-to {
  opacity: 0;
  transform: translateY(-20px);
}

/* ========================================
   8. 下拉框夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .el-select {
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .el-select .el-input__wrapper {
  background: #1a1a1a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-select .el-input__wrapper:hover {
  border-color: #666;
}

#htmlRoot[data-theme='dark'] .el-select .el-input__wrapper.is-focus {
  border-color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-select .el-input__inner {
  background: #1a1a1a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-select .el-input__suffix {
  color: #b0b0b0;
}

/* 下拉选项夜间模式 */
#htmlRoot[data-theme='dark'] .el-select-dropdown {
  background: #2a2a2a;
  border-color: #444;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.5);
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item:hover {
  background: #3a3a3a;
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item.selected {
  background: #409eff;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-select-dropdown__item.is-disabled {
  color: #666;
  background: #2a2a2a;
}

/* ========================================
   9. Selector组件夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .selector-modal-body {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .selector-list {
  background: #2a2a2a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .selector-search-bar {
  background: #2a2a2a;
  border-bottom-color: #444;
}

#htmlRoot[data-theme='dark'] .selector-search-bar .el-form-item__label {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .selector-table-wrapper {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .selector-pagination {
  background: #2a2a2a;
  border-top-color: #444;
}

#htmlRoot[data-theme='dark'] .selector-selected {
  background: #2a2a2a;
  border-left-color: #444;
}

#htmlRoot[data-theme='dark'] .selected-title {
  color: #ffffff;
  border-bottom-color: #444;
}

#htmlRoot[data-theme='dark'] .selected-user {
  background: #1a1a1a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .selected-user:hover {
  background: #3a3a3a;
}

#htmlRoot[data-theme='dark'] .selected-user-name {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .selected-user-account {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .selected-user-remove {
  color: #f56c6c;
}

#htmlRoot[data-theme='dark'] .selected-user-remove:hover {
  background: #f56c6c;
  color: #ffffff;
}

/* 分页夜间模式 */
#htmlRoot[data-theme='dark'] .el-pagination {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pagination__total {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pagination__jump {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pagination__jump .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-pagination .btn-prev,
#htmlRoot[data-theme='dark'] .el-pagination .btn-next {
  background: #2a2a2a;
  border-color: #444;
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-pagination .btn-prev:hover,
#htmlRoot[data-theme='dark'] .el-pagination .btn-next:hover {
  background: #3a3a3a;
  border-color: #666;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pager li {
  background: #2a2a2a;
  border-color: #444;
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pager li:hover {
  background: #3a3a3a;
  border-color: #666;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pager li.is-active {
  background: #409eff;
  border-color: #409eff;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-pagination .el-pagination__sizes .el-select .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

/* ========================================
   10. Workflow页面夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .workflow-start-page {
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .page-header h2 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .page-header p {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .process-card {
  background: #2a2a2a;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  border: 1px solid #333;
}

#htmlRoot[data-theme='dark'] .process-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .card-header h3 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .card-content p {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .card-content strong {
  color: #ffffff;
}

/* 工作流列表页面 */
#htmlRoot[data-theme='dark'] .workflow-list-page {
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .workflow-list-header h2 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .workflow-list-content {
  background: #2a2a2a;
}

/* 工作流详情页面 */
#htmlRoot[data-theme='dark'] .workflow-detail-page {
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .workflow-detail-header h2 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .workflow-detail-content {
  background: #2a2a2a;
}

/* 工作流设计页面 */
#htmlRoot[data-theme='dark'] .workflow-design-page {
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .workflow-design-header h2 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .workflow-design-content {
  background: #2a2a2a;
}

/* 工作流任务页面 */
#htmlRoot[data-theme='dark'] .workflow-task-page {
  background: #1a1a1a;
}

#htmlRoot[data-theme='dark'] .workflow-task-header h2 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .workflow-task-content {
  background: #2a2a2a;
}

/* ========================================
   11. Workflow页面通用夜间模式
   ======================================== */
#htmlRoot[data-theme='dark'] .todo-container,
#htmlRoot[data-theme='dark'] .my-process-container,
#htmlRoot[data-theme='dark'] .history-container,
#htmlRoot[data-theme='dark'] .workbench-container,
#htmlRoot[data-theme='dark'] .process-container,
#htmlRoot[data-theme='dark'] .form-container,
#htmlRoot[data-theme='dark'] .bind-container,
#htmlRoot[data-theme='dark'] .role-process-perm-container {
  background: #1a1a1a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .page-header h2 {
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .page-header p {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .filter-section .el-card {
  background: #2a2a2a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .filter-section .el-form-item__label {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .filter-section .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .filter-section .el-date-editor .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .list-section .el-card,
#htmlRoot[data-theme='dark'] .task-section .el-card,
#htmlRoot[data-theme='dark'] .process-section .el-card {
  background: #2a2a2a;
  border-color: #333;
}

#htmlRoot[data-theme='dark'] .card-header {
  color: #ffffff;
  border-bottom-color: #444;
}

#htmlRoot[data-theme='dark'] .header-actions {
  color: #ffffff;
}

/* 表格夜间模式增强 */
#htmlRoot[data-theme='dark'] .el-table {
  background: #2a2a2a;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-table th {
  background: #3a3a3a;
  border-color: #444;
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-table td {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-table--border {
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-table--border th,
#htmlRoot[data-theme='dark'] .el-table--border td {
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-table .el-table__row:hover > td {
  background: #3a3a3a;
}

#htmlRoot[data-theme='dark'] .el-table .current-row > td {
  background: #409eff !important;
  color: #ffffff;
}

/* 日期选择器夜间模式增强 */
#htmlRoot[data-theme='dark'] .el-date-editor {
  background: #1a1a1a;
  border-color: #444;
}

#htmlRoot[data-theme='dark'] .el-date-editor .el-input__inner {
  background: #1a1a1a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-date-editor .el-input__suffix {
  color: #b0b0b0;
}

/* 标签页夜间模式增强 */
#htmlRoot[data-theme='dark'] .el-tabs__header {
  background: #2a2a2a;
  border-bottom-color: #444;
}

#htmlRoot[data-theme='dark'] .el-tabs__item {
  color: #b0b0b0;
}

#htmlRoot[data-theme='dark'] .el-tabs__item.is-active {
  color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-tabs__active-bar {
  background-color: #409eff;
}

#htmlRoot[data-theme='dark'] .el-tabs__content {
  background: #2a2a2a;
}

/* 空状态夜间模式 */
#htmlRoot[data-theme='dark'] .el-empty {
  background: #2a2a2a;
}

#htmlRoot[data-theme='dark'] .el-empty__description {
  color: #b0b0b0;
}

/* 加载状态夜间模式 */
#htmlRoot[data-theme='dark'] .el-loading-mask {
  background: rgba(26, 26, 26, 0.8);
}

#htmlRoot[data-theme='dark'] .el-loading-spinner .el-loading-text {
  color: #ffffff;
}

/* 工具提示夜间模式 */
#htmlRoot[data-theme='dark'] .el-tooltip__popper {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
}

/* 弹出框夜间模式增强 */
#htmlRoot[data-theme='dark'] .el-popover {
  background: #2a2a2a;
  border-color: #444;
  color: #ffffff;
}

#htmlRoot[data-theme='dark'] .el-popover__title {
  color: #ffffff;
  border-bottom-color: #444;
}
